<template>
	<view class="u-margin-left-26 u-margin-right-26"> <!-- 左,右边距26 -->
		<!--表单-->
		
		<u-form ref="ufrom" :model="user">
			<!-- 用户名 -->
			<u-form-item left-icon="account" label="账号" label-width='120' prop="zhanghao">
				<u-input type="text" placeholder="请输入账号" v-model="user.zhanghao"></u-input>
			</u-form-item>

			<!-- 密码 -->
			<u-form-item left-icon="lock" label="密码" label-width='120' prop="mima">
				<u-input type="password" placeholder="请输入密码" :password-icon="passwordIcon" v-model="user.mima"></u-input>
			</u-form-item>
		</u-form>
		
		
			<!-- 记住密码 -->
		<u-form-item label="记住密码" label-width="150" class="uni-list-cell-db">
			<u-switch slot="right" active-color="#00ff00" inactive-color="#ffffff" v-model="checked"></u-switch>
		</u-form-item>
		
		
			<!-- 提交 -->
		<u-button @click="submit">提交</u-button>
		
			<!-- 注册，超链接 -->
		<!--<view class="u-demo-area">
			<u-link :color ='color' :font-size="fontsize" :href="href" :under-line="underLine">注册</u-link>
		</view> -->
		
		<!-- 注册，跳转页面 -->
		<u-button @click="goRegister">没有账号？注册，启动！！！</u-button>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				checked: false,
				passwordIcon:true,		//控制是否显示密码图标
				color:'#00f540', 		//控制提交按钮颜色
				href:"http://baidu.com",//控制要跳到的地址
				underLine:true,			//下划线
				fontsize:28,			//字体大小-注册
				//form表单关联
				user:{
					zhanghao:"",
					mima:""
				},
				//添加一个规则
				rules:{
					zhanghao:[
						{
							required:true,	      		//这个值是必须填的
							message:"请输入姓名", 		//提示信息
							trigger:['change','blur'] 	//值发生更改或者失去焦点
							
						}
					],
					mima:[
						{
							required:true,	      		//这个值是必须填的
							message:"请输入密码", 		//提示信息
							trigger:['change','blur'] 	//值发生更改或者失去焦点
							
						}
					]
				}
				
			}
		},
		onReady() {
			this.$refs.ufrom.setRules(this.rules);
		},

		methods: {
			//点击事件	
			submit(){
				//打印
				console.log('登录')
				//网络提交数据
				uni.request({
					url:"http://localhost:9090/doLogin",
					method:"POST",
					data:this.user,
					success:(res)=>{
						console.log(res);
						//成功，code 200,保存用户信息，跳回个人中心
						if(res.data.code*1==200){
							uni.setStorageSync("user",res.data.result);
							uni.navigateBack(); //退回上一页
						}
						//失败
						else{
							this.$u.toast("登录失败，用户名或者密码错误！")
						}
					}  
				});

			},
			//
			change(status) {
							// console.log(status);
						},
			goRegister(){
				uni.navigateTo({
					url:"/pages/register"
				})
			},

			
		}
	}
</script>

<style>
	/* 自定义样式 */
	.u-demo-area{
		cursor: pointer; /* 鼠标指针 */
	}

</style>
